<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="sass/reset.css">
    <link rel="stylesheet" type="text/css" href="sass/css.css">
    <title>Document</title>
</head>

<body>
    <!-- 顶部start -->
    <div class="top1">
        <div class="img">
            <img src="img/logo-top.png">
        </div>
    </div>
    <div class="top2">
        <div class="left">
            <div>首页</div>
            <div>景观</div>
            <div>谈资</div>
            <div>作者</div>
            <div>大讲堂</div>
            <div>活动</div>
            <div>商城</div>
        </div>
        <div class="right">
            <div>APP</div>
            <div>投稿</div>
            <div>登录</div>
        </div>
    </div>
    <!-- 顶部end -->
    <!-- 中间部分start -->
    <div class="mid">
        <div class="left-wrapper">
            <div class="left-items-mid">
                <div class="left-items">
                    <div class="number-wrapper">
                        <span>景观</span>
                        <span>LANDSCAPE</span>
                    </div>
                </div>
                <div class="right-items">
                    <div class="left-img">
                        <div class="img">
                            <img src="img/02-1.jpg" alt="">
                        </div>
                        <div class="img">
                            <img src="img/02-3.jpg" alt="">
                        </div>
                        <div class="img">
                            <img src="img/02-4.jpg" alt="">
                        </div>
                    </div>
                    <div class="right-img">
                        <div class="img1">
                            <img src="img/02-2.jpg" alt="">
                        </div>
                        <div class="img2">
                            <img src="img/02-5.jpg" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="right-wrapper">
            <div class="top">
                <span>寻找中国最美景观拍摄点</span>
            </div>
            <div class="middle">
                <div class="mag"><span>杂志：</span></div>
                <div class="image">
                    <img src="img/02-6.jpg" alt="">
                    <img src="img/02-7.jpg" alt="">
                    <img src="img/02-8.jpg" alt="">
                </div>
            </div>
            <div class="bottom">
                <div class="activity"><span>活动：</span></div>
                <div class="image1">
                    <div class="one">
                        <img src="img/02-9.jpg" alt="">
                        <img src="img/02-10.jpg" alt="">
                        <img src="img/02-11.jpg" alt="">
                        <img src="img/02-12.jpg" alt="">
                    </div>
                    <div class="one">
                        <img src="img/02-12.jpg" alt="">
                        <img src="img/02-14.jpg" alt="">
                        <img src="img/02-15.jpg" alt="">
                        <img src="img/02-16.jpg" alt="">
                    </div>
                    <div class="one">
                        <img src="img/02-15.jpg" alt="">
                        <img src="img/02-16.jpg" alt="">
                        <img src="img/02-11.jpg" alt="">
                        <img src="img/02-10.jpg" alt="">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--中间部分end -->
</body>

</html>